﻿var App = null;

$(function () {

    App = Ember.Application.create();

    // Define Types:

    // DOM (not required)
    App.ProductModel = Ember.Object.extend({
        Order: null,
        Id: null,
        Name: null,
        Date: null,
        Description: null
    });

    App.SortOptionCtrl = Em.Controller.extend({
        Name: null,
        Predicate: null,

        _isActive: false,
        isActive: function () {
            return this.get('_isActive');
        }.property('_isActive'),

        _isDesc: false,
        isDesc: function () {
            return this.get('_isDesc');
        }.property('_isDesc'),

        controller: null,

        updateState: function () {
            if (!this.Predicate) {
                this.set('_isActive', (this.get('controller').get('activePredicate') == null));
                this.set('_isDesc', false);
            }
            else {
                this.set('_isActive', (this.get('controller').get('activePredicate') == this.Predicate));
                this.set('_isDesc', (this.get('_isActive') && !this.get('controller').get('sortAscending')));
            }
        }.observes('controller.activePredicate', 'controller.sortAscending'),

        sortBy: function () {
            if (this.get('controller') != null) {
                this.get('controller').sortBy(this.Predicate);
            }
        },
    });

    App.ProductsController = Ember.ArrayController.extend({

        content: [],
        viewContent: [],
        activePredicate: null,
        sortProperties: ['Order'],
        sortAscending: true,
        sortOptions: [],

        filter: function (obj) {
            return true;
        },

        init: function () {

            this._super();

            var ctrl = this;

            this.sortOptions.pushObject(App.SortOptionCtrl.create({
                Name: 'Unsorted',
                Predicate: null,
                controller: ctrl,
            }));
            this.sortOptions.pushObject(App.SortOptionCtrl.create({
                Name: 'By Name',
                Predicate: 'Name',
                controller: ctrl,
            }));
            this.sortOptions.pushObject(App.SortOptionCtrl.create({
                Name: 'By Date',
                Predicate: 'Date',
                controller: ctrl,
            }));

            this.sortOptions.forEach(function (opt) {
                opt.updateState();
            });
        },

        load: function () {

            results = this.content;
            results.length = 0;

            $.ajax({
                type: 'GET',
                url: '/api/ProductsApi/',
                dataType: 'json',

                success: function (data) {

                    var order = 0;

                    $(data).each(function (obj) {
                        // Not using DOM
                        //results.pushObject(this);

                        // Using DOM
                        results.pushObject(App.ProductModel.create({
                            Order: order++,
                            Id: this.Id,
                            Name: this.Name,
                            Date: this.Date,
                            Description: this.Description
                        }));
                    });
                },

                error: function (errorData) {
                    alert('Failed to get products from server.')
                }
            });
        },

        sortBy: function (predicate) {

            var prevPredicate = this.sortProperties[0];

            if (predicate == prevPredicate && predicate != null) {
                this.set('sortAscending', !(this.get('sortAscending')));
            }
            else {
                this.set('sortAscending', true);
            }

            this.set('activePredicate', predicate);
            this.set('sortProperties.length', 0);

            if (predicate)
                this.get('sortProperties').pushObject(predicate);
            else
                this.get('sortProperties').pushObject('Order');
        },

    });

    App.ProductsView = Ember.View.extend({
        templateName: 'products-table'
    });

    App.ProductView = Ember.View.extend({
        templateName: 'product-row'//,

        //_formattedDate: false,
        //formattedDate: function () {
            //var date = '111';//this.get('controller').get('Date');
            //return date;
            //return this.get('_formattedDate');
        //}.property('_formattedDate'),

        //formatDate: function () {
        //    alert(this.get('content'));
        //    var date = this.get('content').get('Date');
        //    this.set('_formattedDate', date);//.format('dd MMM yyyy'));
        //}.observes('content.Date'),
    });

    App.SortOptionView = Ember.View.extend({
        templateName: 'sort-option-item'
    });

    // Create Instances:

    App.productsController = App.ProductsController.create({
    });

    App.productsController.load();

    App.init();

    //App.productsController.init();
});
